import { $ } from './jquery-module.js';
import cookie from './library/cookie.js';
import './library/jquery.lazyload.js';
$('#header').load('./header_module.html');
$('#last-box').load('./floor_module.html');
$(function() {

    /*获取登录用户信息*/
    if (cookie.get('user')) {
        $('.list:last li:first').html(`<a href="javaScript:;">${cookie.get('user')}</a><div class="userBox">
        <section>
            <img src="../img/头像.png" alt="">
            <div>
                <p><em></em><span></span></p>
                <div>
                    <a href="javascript:;"><em></em> 未实名</a><a href="javascript:;"><em></em>消息</a></div>
            </div>
        </section>
        <section>
            <dl>
                <dt><span>我的订单</span><a href="javaScript:;">更多</a></dt>
            </dl>
            <ul>
                <li><a href="javaScript:;">待付款</a></li>
                <li><a href="javaScript:;">待收货</a></li>
                <li><a href="javaScript:;">待评价</a></li>
                <li><a href="javaScript:;">退换货</a></li>
                <li><a href="javaScript:;">旧机回收</a></li>
            </ul>
        </section>
        <section>
            <a href="javaScript:;"><span>0</span><span>积分</span></a><a href="javaScript:;"><span>0</span><span>优惠券</span></a><a href="javaScript:;"><span>0.00</span><span>代金券</span></a>
        </section>
        <button>退出登录</button></div>`);
        $('.list:last li:first').addClass('drop-down users');
        /*退出登录事件*/
        $('.list:last li:first button').click(function() {
            cookie.set('user', '');
            location.href = './index.html';
        })
    } else {
        $('.list:last li:first').html(`<a href="../html/login.html">请登录</a>&nbsp;<a href="../html/reg.html">注册</a>`);
        $('.list:last li:first').removeClass('drop-down users');
    }
    if (cookie.get('user')) {
        $('.user-box section:first span').html(`您好！${cookie.get('user')}。`);
    } else {
        $('.user-box section:first span').html('您好！请 <a href="../html/login.html"> 登录 </a>/<a href="../html/reg.html"> 注册</a>');
    }
    /*精品轮播*/
    $('.jp').children('.ck').first().click(function() {
        if ($('.jp-box').children('ul').css('left').slice(0, -2) < 0) {
            $('.jp-box').children('ul').animate({
                left: '+=1210'
            }, 500)
        }

    })
    $('.jp').children('.ck').last().click(function() {
        if ($('.jp-box').children('ul').css('left').slice(0, -2) > -3000) {
            $('.jp-box').children('ul').animate({
                left: '-=1210'
            }, 500)
        }
    })
    setInterval(function() {
            let lf = $('.jp-box').children('ul').css('left').slice(0, -2);
            if (lf == 0) {
                $('.jp').children('.ck').first().css('display', 'none');
                $('.jp').children('span').first().css('display', 'none');
            } else {
                $('.jp').children('.ck').first().css('display', 'inline-block');
                $('.jp').children('span').first().css('display', 'inline-block');
            }
            if (lf == -3630) {
                $('.jp').children('.ck').last().css('display', 'none');
                $('.jp').children('span').last().css('display', 'none');
            } else {
                $('.jp').children('.ck').last().css('display', 'inline-block');
                $('.jp').children('span').last().css('display', 'inline-block');
            }
        }, 100)
        /*楼梯事件 */
    $('.index-tabs>a').on('click', function() {
        let elm = $(`#${$(this).attr('title')}`);
        let top = elm.offset().top;
        $(this).css('borderRight', ' 2px solid #ca141d');

        $('html').animate({
            scrollTop: top
        }, 300);
    });
    $('.tabs-top').click(function() {
        $('html').animate({
            scrollTop: 0
        }, 300);
    })
    $(window).on('scroll', function() {
        let top = $(document).scrollTop();
        if (top > 1000) {
            let _index = Math.round((top - 1000) / 500);
            $('.index-tabs>a').css('borderRight', ' 0').eq(_index).css('borderRight', ' 2px solid #ca141d');
        } else {
            $('.index-tabs>a').css('borderRight', ' 0');
        }

    });
    /*图片懒加载*/
    $("img.lazy").lazyload({ effect: "fadeIn", placeholder: "../img/懒加载.jpg" });
    /*搜索*/
    $('.form-control').focus(function() {
        $('.key-search').css('display', 'none');
    });
    $('.form-control').focusout(function() {
        $('.key-search').css('display', 'inline-block');
    });

    function searchChange(fn) {
        let timer;
        return function() {
            if (!timer) {
                timer = setTimeout(function() {
                    fn();
                    timer = null;
                }, 500);

            }
        }
    }

    function fn() {
        let search = $('.form-control').val();
        $.post('../../interface/search.php', { search }, function(response) {
            let content = '';
            if (response) {
                response = JSON.parse(response);
                response.forEach(elm => {
                    content += `<li><a href='../html/product.details.html?id=${elm.id}'>${elm.search}</a></li>`;
                })
            }
            $('.search-result').html(content);
        })
    }
    $('.form-control').on('input', searchChange(fn));
    /*搜索按钮事件 */
    $('.btn-default').click(function() {
        $(".navbar-form").submit(function() {
            return false;
        });
        if ($('.search-result a').text() == $('.form-control').val()) {
            location.href = `${$('.search-result a').attr('href')}`;
        }
    })
});